import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
import { Button } from "@/components/ui/button"
import Link from "next/link"
import { AlertCircle, Sparkles } from "lucide-react"

export default async function ErrorPage() {
  const params = { error: '' }

  return (
    <div className="flex min-h-screen w-full items-center justify-center bg-gradient-to-b from-background to-muted/20 p-6 md:p-10">
      <div className="w-full max-w-sm">
        <div className="mb-6 flex items-center justify-center gap-2">
          <Sparkles className="h-6 w-6 text-primary" />
          <span className="text-xl font-bold">小红书 AI 生成器</span>
        </div>
        <Card className="py-6">
          <CardHeader>
            <div className="mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-destructive/10">
              <AlertCircle className="h-6 w-6 text-destructive" />
            </div>
            <CardTitle className="text-center text-2xl">出错了</CardTitle>
          </CardHeader>
          <CardContent className="space-y-4">
            {params?.error ? (
              <p className="text-center text-sm text-muted-foreground">错误代码: {params.error}</p>
            ) : (
              <p className="text-center text-sm text-muted-foreground">发生了未知错误，请稍后重试。</p>
            )}
            <Link href="/auth/login" className="block w-full">
              <Button className="w-full">返回登录</Button>
            </Link>
          </CardContent>
        </Card>
      </div>
    </div>
  )
}
